<template>
    <div>
        <img class="headerImg" src="@/assets/img/logo.png" alt="">
        <ul>
            <li v-for="item in mineArry" class="mine-item" @click="itemClick(item)" :key="item.label">
                <span class="mineTitle">{{item.label}}</span>
                <i class="cubeic-arrow"></i>
            </li>
        </ul>
    </div>
</template>
<script>
export default {
    name:'Mine',
    data() {
        return {
            mineArry:[
                {label:'商品收藏'},
                {label:'我的足迹'},
                {label:'店铺收藏'},
                {label:'我的订单'},
                {label:'退出',type:'exit'},
            ]
        }
    },
    methods: {
        itemClick(item){
            if(item.type=='exit'){
                this.$store.commit('setToken','')
                localStorage.removeItem('token')
                this.$router.replace('/login')
            }
        }
    },
}
</script>
<style lang="stylus" scoped>
.headerImg{
    height 150px
    width 100%
}
.mine-item{
    font-size 14px
    text-align left 
    height 50px
    line-height 50px
    border-bottom 1px solid #eee
    padding-left 5%
    .mineTitle{
        display inline-block
        width 90%
    }
}
</style>